*,*:before,*:after{box-sizing:border-box}*{padding:0;margin:0;font:inherit}img,picture{display:block;max-width:100%}ul,ol{list-style:none}input{border:none}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none}input[type=number]{-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}button{border:none;background:inherit;cursor:pointer}:root{--Red: hsl(14, 86%, 42%);--Green: hsl(159, 69%, 38%);--Rose-50: hsl(20, 50%, 98%);--Rose-100: hsl(13, 31%, 94%);--Rose-300: hsl(14, 25%, 72%);--Rose-400: hsl(7, 20%, 60%);--Rose-500: hsl(12, 20%, 44%);--Rose-900: hsl(14, 65%, 9%);--font-weight-regular: 400;--font-weight-bold: 600;--font-weight-extrabold: 700}body{--body-padding-inline: 2rem;--body-padding-block: 5.5rem;--cart-width: 24rem;font-family:Red Hat Text;font-weight:var(--font-weight-regular);background-color:var(--Rose-100);padding-inline:var(--body-padding-inline);padding-block:var(--body-padding-block)}.main{display:grid;grid-template-columns:1fr var(--cart-width);gap:32px}.menu__heading{font-size:2rem;font-weight:var(--font-weight-extrabold);color:var(--Rose-900);margin-block-end:2rem}.menu__cards-wrapper{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px}.menu-card____input-not-empty .menu-card__img{outline:3px solid var(--Red)}.menu-card____input-not-empty .menu-card__label{display:none}.menu-card__picture-wrapper{position:relative}.menu-card__img{border-radius:8px;margin-block-end:2.5rem}.menu-card__field-wrapper{position:absolute;bottom:0;left:50%;height:2.75rem;width:10rem;transform:translate(-50%) translateY(50%);background-color:var(--Rose-50);border:1px solid var(--Rose-500);border-radius:56px;display:grid;place-content:center}@media (any-hover: hover){.menu-card__field-wrapper:hover .menu-card__label{display:none}}.menu-card__field-wrapper:has(:focus) .menu-card__label{display:none}.menu-card__field-wrapper.hide-label .menu-card__label{display:none}.menu-card__label{display:flex;justify-content:center;align-items:center;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:56px;gap:.5rem;z-index:10;background-color:var(--Rose-50)}.menu-card__label-add-to-cart{color:var(--Rose-900)}.menu-card__input-wrapper{position:absolute;top:0;right:0;bottom:0;left:0;color:var(--Rose-50);background-color:var(--Red);border-radius:56px;display:flex;justify-content:space-between;align-items:center;padding-inline:.75rem}.menu-card__input{width:5ch;background-color:inherit;text-align:center;color:var(--Rose-50)}.menu-card__input-button{border-radius:50%;aspect-ratio:1;border:1px solid var(--Rose-50);padding:4px}.menu-card__category{color:var(--Rose-500);margin-block-end:.5rem}.menu-card__name{font-weight:var(--font-weight-bold);margin-block-end:.5rem}.menu-card__price{color:var(--Red)}.cart{position:fixed;top:var(--body-padding-block);right:var(--body-padding-inline);background-color:var(--Rose-50);border-radius:8px;padding:24px;height:fit-content;width:var(--cart-width)}.cart__heading{color:var(--Red);font-size:1.25rem;font-weight:var(--font-weight-bold);margin-block-end:1.5rem}.cart__card{display:flex;justify-content:space-between;align-items:center;padding-block:1rem}.cart____empty .cart__cards-wrapper{display:none}.cart____empty .cart__empty-wrapper{display:grid}.cart__empty-wrapper{display:none;justify-items:center}.cart__empty-img{margin-block-start:1rem}.cart__empty-description{margin-block-start:1rem;color:var(--Rose-500)}.cart__card-amount{margin-inline-end:1rem}.item-amount{color:var(--Red)}.item-amount:after{content:"x"}.cart__card-price{margin-inline-end:.5rem}.item-price{color:var(--Rose-300);font-weight:var(--font-weight-bold)}.item-price:before{content:"@ $"}.cart__card-subtotal{color:var(--Rose-500);font-weight:var(--font-weight-bold)}.item-subtotal:before{content:"$"}.cart__card-remove-item-button{border:1px solid var(--Rose-300);border-radius:50%;display:grid;place-content:center;padding:4px}@media (any-hover: hover){.cart__card-remove-item-button:hover{border-color:var(--Rose-900)}.cart__card-remove-item-button:hover svg path{fill:var(--Rose-900)}}.cart__card-remove-item-button:focus-visible{border-color:var(--Rose-900)}.cart__card-remove-item-button:focus-visible svg path{fill:var(--Rose-900)}.cart__total-price-wrapper{margin-block:1.75rem}.total-price-wrapper{display:flex;justify-content:space-between;align-items:center}.total-price-heading{color:var(--Rose-900)}.total-price-amount{font-size:1.75rem;font-weight:var(--font-weight-bold)}.total-price-amount:before{content:"$"}.cart__comment-wrapper{background-color:var(--Rose-100);height:3rem;border-radius:8px;display:flex;justify-content:center;align-items:center;gap:.5rem}.cart__comment{color:var(--Rose-900)}.cart__comment em{font-weight:var(--font-weight-bold)}.cart__confirm-button{display:grid;width:100%;height:3.5rem;background-color:hsl(from var(--Red) h s calc(l - 15%));color:var(--Rose-50);border-radius:32px;margin-block:1.5rem;place-content:center}.confirm{margin-inline:auto;margin-block:auto;border:none;border-radius:12px}.confirm::backdrop{background-color:#0006}.confirm__wrapper{padding:2.5rem;width:37rem}.confirm__heading{font-size:2rem;font-weight:var(--font-weight-extrabold);margin-block-start:1.5rem}.confirm__description{margin-block-start:1rem}.confirm__cards-wrapper{margin-block-start:2rem;background-color:var(--Rose-50);border-radius:8px;padding-inline:1.5rem}.confirm__card{display:flex;align-items:center;padding-block:1.5rem;border-bottom:1px solid var(--Rose-100);gap:1rem}.confirm__card-thumbnail{width:3rem;height:3rem;border-radius:4px}.confirm__card-heading{margin-block-end:.5rem}.confirm__card-amount{margin-inline-end:1rem}.confirm__card-subtotal{margin-inline-start:auto}.confirm__total-price-wrapper{padding-block:1.5rem}.confirm__button{margin-block:2rem;width:100%;background-color:var(--Red);height:3.5rem;color:var(--Rose-50);border-radius:32px;font-size:1.125rem}@media (max-width: 750px){body{--body-padding-block: 2rem}.main{grid-template-columns:unset}.cart{position:static;width:100%}.confirm{max-width:unset;width:100%;top:95px;margin:unset}.confirm__wrapper{width:100%;padding:1.5rem}}
